import { defineStore } from 'pinia'

export const useAppStore = defineStore('app', {
  state: () => ({
    // 侧边栏状态
    sidebarCollapsed: false,
    sidebarWidth: 280,
    
    // 主题设置
    theme: 'light',
    
    // 布局设置
    layout: {
      showTopBar: false,
      showSidebar: true,
      showStatusBar: true
    },
    
    // 当前激活的服务
    activeService: 'database',
    
    // 应用设置
    settings: {
      language: 'zh-CN',
      autoSave: true,
      confirmBeforeClose: true,
      maxTabs: 20
    },
    
    // 加载状态
    loading: false,
    
    // 全局消息
    messages: []
  }),
  
  getters: {
    // 是否为暗色主题
    isDarkTheme: (state) => state.theme === 'dark',
    
    // 侧边栏实际宽度
    actualSidebarWidth: (state) => {
      return state.sidebarCollapsed ? 60 : state.sidebarWidth
    },
    
    // 可用服务列表
    availableServices: () => [
      {
        key: 'database',
        name: '数据库服务',
        icon: 'Database',
        path: '/database',
        enabled: true
      },
      {
        key: 'file',
        name: '文件服务',
        icon: 'Folder',
        path: '/file',
        enabled: false
      },
      {
        key: 'api',
        name: 'API服务',
        icon: 'Connection',
        path: '/api',
        enabled: false
      },
      {
        key: 'settings',
        name: '设置',
        icon: 'Setting',
        path: '/settings',
        enabled: true
      }
    ]
  },
  
  actions: {
    // 切换侧边栏折叠状态
    toggleSidebar() {
      this.sidebarCollapsed = !this.sidebarCollapsed
      this.saveSidebarState()
    },
    
    // 设置侧边栏宽度
    setSidebarWidth(width) {
      this.sidebarWidth = Math.max(200, Math.min(400, width))
      this.saveSidebarState()
    },
    
    // 切换主题
    toggleTheme() {
      this.theme = this.theme === 'light' ? 'dark' : 'light'
      this.saveTheme()
      this.applyTheme()
    },
    
    // 设置主题
    setTheme(theme) {
      this.theme = theme
      this.saveTheme()
      this.applyTheme()
    },
    
    // 应用主题
    applyTheme() {
      const html = document.documentElement
      if (this.theme === 'dark') {
        html.classList.add('dark')
      } else {
        html.classList.remove('dark')
      }
    },
    
    // 设置激活的服务
    setActiveService(service) {
      this.activeService = service
    },
    
    // 更新布局设置
    updateLayout(layout) {
      this.layout = { ...this.layout, ...layout }
      this.saveLayout()
    },
    
    // 更新应用设置
    updateSettings(settings) {
      this.settings = { ...this.settings, ...settings }
      this.saveSettings()
    },
    
    // 设置加载状态
    setLoading(loading) {
      this.loading = loading
    },
    
    // 添加消息
    addMessage(message) {
      const id = Date.now()
      this.messages.push({
        id,
        ...message,
        timestamp: new Date()
      })
      
      // 自动清除消息
      if (message.autoClose !== false) {
        setTimeout(() => {
          this.removeMessage(id)
        }, message.duration || 3000)
      }
    },
    
    // 移除消息
    removeMessage(id) {
      const index = this.messages.findIndex(msg => msg.id === id)
      if (index > -1) {
        this.messages.splice(index, 1)
      }
    },
    
    // 清除所有消息
    clearMessages() {
      this.messages = []
    },
    
    // 保存侧边栏状态到本地存储
    saveSidebarState() {
      localStorage.setItem('app-sidebar', JSON.stringify({
        collapsed: this.sidebarCollapsed,
        width: this.sidebarWidth
      }))
    },
    
    // 保存主题到本地存储
    saveTheme() {
      localStorage.setItem('app-theme', this.theme)
    },
    
    // 保存布局设置到本地存储
    saveLayout() {
      localStorage.setItem('app-layout', JSON.stringify(this.layout))
    },
    
    // 保存应用设置到本地存储
    saveSettings() {
      localStorage.setItem('app-settings', JSON.stringify(this.settings))
    },
    
    // 从本地存储恢复状态
    restoreState() {
      // 恢复侧边栏状态
      const sidebarState = localStorage.getItem('app-sidebar')
      if (sidebarState) {
        try {
          const parsed = JSON.parse(sidebarState)
          this.sidebarCollapsed = parsed.collapsed || false
          this.sidebarWidth = parsed.width || 280
        } catch (e) {
          console.warn('Failed to restore sidebar state:', e)
        }
      }
      
      // 恢复主题
      const theme = localStorage.getItem('app-theme')
      if (theme) {
        this.theme = theme
        this.applyTheme()
      }
      
      // 恢复布局设置
      const layout = localStorage.getItem('app-layout')
      if (layout) {
        try {
          this.layout = { ...this.layout, ...JSON.parse(layout) }
        } catch (e) {
          console.warn('Failed to restore layout:', e)
        }
      }
      
      // 恢复应用设置
      const settings = localStorage.getItem('app-settings')
      if (settings) {
        try {
          this.settings = { ...this.settings, ...JSON.parse(settings) }
        } catch (e) {
          console.warn('Failed to restore settings:', e)
        }
      }
    },
    
    // 重置所有设置
    resetSettings() {
      this.sidebarCollapsed = false
      this.sidebarWidth = 280
      this.theme = 'light'
      this.layout = {
        showTopBar: false,
        showSidebar: true,
        showStatusBar: true
      }
      this.settings = {
        language: 'zh-CN',
        autoSave: true,
        confirmBeforeClose: true,
        maxTabs: 20
      }
      
      // 清除本地存储
      localStorage.removeItem('app-sidebar')
      localStorage.removeItem('app-theme')
      localStorage.removeItem('app-layout')
      localStorage.removeItem('app-settings')
      
      this.applyTheme()
    }
  }
}) 